<!--
 * @Author: ZhaoChenGuang
 * @Date: 2025-01-18 14:13:37
 * @Description: 
-->
<script setup>
import { ref } from 'vue';
import { useVbenDrawer, useVbenForm } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { API_URL_COMPANY_LIST, req } from '#/api/index';

const loading = ref(false);
const props = defineProps({
  callbackFunc: { type: Function, default: null },
});

const [Drawer, drawerApi] = useVbenDrawer({
  onCancel() {
    drawerApi.close();
  },
  onClosed() {
    drawerApi.setState({ overlayBlur: 0, placement: 'right' });
  },
  async onOpenChange(isOpen) {
    if (isOpen) {
      const { values } = await drawerApi.getData();
      if (values) {
        formApi.setValues(values);
      }
    }
  },
  async onConfirm() {
    try {
      const {values} = await drawerApi.getData();
      loading.value = true;
      const data = await formApi.getValues();
      if (values && values.id) {
        // 修改
        console.log('修改')
        await req.updateById(API_URL_COMPANY_LIST, values.id, data);
      } else {
        // 新增
        console.log('新增')
        await req.add(API_URL_COMPANY_LIST, data);
      }
      formApi.resetForm();
      message.success('操作成功');
      loading.value = false;
      await props.callbackFunc();
      drawerApi.close();
    } catch (error) {
      loading.value = false;
    }
  },
});

const [BaseForm, formApi] = useVbenForm({
  // 所有表单项共用，可单独在表单内覆盖
  commonConfig: {
    // 在label后显示一个冒号
    colon: true,
    // 所有表单项
    componentProps: {
      class: 'w-full',
    },
  },
  resetButtonOptions: { show: false },
  submitButtonOptions: { show: false },
  // handleSubmit: onSubmit,
  layout: 'horizontal',
  schema: [
    {
      component: 'Input',
      fieldName: 'name',
      label: '井队名称',
    },
  ],
});
</script>

<template>
  <Drawer :loading="loading" title-tooltip="标题提示内容">
    <BaseForm> </BaseForm>
  </Drawer>
</template>
